<template>
  <div class="wk-empty">
    <div class="wk-empty__title">{{ config.emptyText || '暂无数据' }}</div>
    <el-button v-if="config.showButton" :icon="config.buttonIcon"
               class="wk-empty__button xr-btn--orange"
               type="primary"
               @click="btnClick">
      {{ config.buttonTitle || '新建' }}
    </el-button>
  </div>
</template>

<script setup>
// 空数据
import merge from '/src/utils/merge.js'
import {computed} from "vue";

const DefaultEmptyProps = {
  emptyText: '', // 是否搜索
  showButton: false,
  buttonIcon: 'el-icon-plus', // 员工列表请求
  buttonTitle: '' // 空参数
}

defineOptions({
  name: 'WkEmpty',
})

const props = defineProps({
  props: Object
})

const emits = defineEmits(['click'])

const config = computed(() => {
  return merge({...DefaultEmptyProps}, props.props || {})
})

function btnClick() {
  emits('click')
}
</script>


<style lang="scss">
.wk-empty {
  color: #999;

  &__button {
    margin-top: 8px;
  }
}
</style>
